<template>
          <el-container>
      <el-header height="80px">
        <el-row class="header">
            <el-col :span="4"><h1>XXX管理系统</h1></el-col>
            <el-col :span="4" :offset="15"><h3>姓名：{{name}}</h3></el-col>
            <el-col :span="1" ><el-button type="primary" icon="el-icon-error" circle @click="set()"></el-button></el-col>
        </el-row>
  </el-header>
  <el-container>
        <el-aside width="200px">
            <el-menu
      :default-active="$router.history.current.path"
      class="el-menu-vertical-demo"
     
      background-color="#545c64"
      text-color="#fff"
      active-text-color="#ffd04b"
      :router="true">
      
      <el-menu-item index="/manager/student">
        <i class="el-icon-menu"></i>
        <span slot="title">学生管理</span>
      </el-menu-item>
      <el-menu-item index="/manager/course">
        <i class="el-icon-document"></i>
        <span slot="title">课程管理</span>
      </el-menu-item>
      <el-menu-item index="/manager/class">
        <i class="el-icon-setting"></i>
        <span slot="title">班级管理</span>
      </el-menu-item>
    </el-menu>
        </el-aside>
        <el-main>
            <router-view></router-view>
        </el-main>
    </el-container>
</el-container>
</template>

<script>
import {getSession,setSession} from '../service'
export default {
    data(){
        return{
         name:"",
        }
    },
    async created(){
        let response =await getSession();
        if(response.status==2){
            this.$router.push("login");
        }else{
            this.name=response.data.name;
        }
        
    },
    methods:{
         set(){
        this.$confirm('注销登陆?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$message({
            type: 'success',
            message: '注销成功!'
          });
           setSession();
         this.$router.push("login");
        }).catch(() => {        
        });
        }
    }

}
</script>
<style>
   .el-header{
        background: #2b303b;
        color: white;
        
    }
    .header{
        display: flex;
        align-items: center;
    }
    .el-container,.el-aside,.el-menu{
        height:100%;
    }
</style>